/**
* 左边菜单
*/ 
<template>
  <el-menu
    default-active="2"
    :collapse="collapsed"
    collapse-transition
    router
    :default-active="$route.path"
    @select="handleSelect"
    unique-opened
    background-color="#fff" 
    active-text-color="#e3b85a"
    class="el-menu-vertical-demo"
  >
  <!-- background-color="#fff"  -->
  <!-- text-color="#A3AED0" --> 
    <div class="logobox">
      <img
        v-if="!collapsed"
        class="logoimg pointer"
        src="~@/assets/img/logo.png"
        @click="toIndex"
      />
      <!-- <span v-else>Gwhale</span> -->
    </div>
    <el-submenu
      v-for="menu in allmenu"
      :key="menu.menuid"
      :index="menu.menuname"
    >
      <template slot="title" v-if="menu.permission"> 
        <i class="font-w6 font20"  :class="menu.icon"></i> 
        <span >{{ menu.menuname }}</span> 
      </template>
      <el-menu-item-group> 
        <div v-for="chmenu in menu.menus"  :key="chmenu.menuid" > 
            <el-menu-item 
              :index="'/' + chmenu.url"
              :key="chmenu.menuid"  
              v-if="chmenu.permission"
            >  
                <i class="font-w6 font20" :class="chmenu.icon"></i>
                <span>{{ chmenu.menuname }}</span> 
            </el-menu-item> 
        </div> 
      </el-menu-item-group>
    </el-submenu> 
  </el-menu>
</template>
<script>
import { mapState, mapGetters } from "vuex";
import { setStoreS, removeStoreS, insertCharacter, spStr } from "../utils/util";
import { service } from "../api/axiosFun";
export default {
  name: "leftnav",
  inject: ["reload"],
  data() {
    return {
      userInfo: null,
      collapsed: false,
      allmenu: [],
    };
  },
  computed: {
    ...mapGetters(["getUser",'']),
  },
  watch: {
    getUser(newVal) {
      this.userInfo = JSON.parse(newVal);
    },
  },
  created() {
    if (this.$store.state.user) {
      this.userInfo = JSON.parse(this.$store.state.user);
      this.getMume();
    } else {
      this.getInfo(); 
    }
    // console.log(this.$hasPermission(['admin0']),"this.$hasPermission('admin0')")
  },
  methods: {
    getInfo() {
      service
        .get("/api/photon/getUserInfo")
        .then((res) => {
          this.loading = false;
          if (res.code == 0) {
            this.userInfo = res.data;
            this.getMume();
            this.$store.commit("user", JSON.stringify(res.data));
          } else {
            this.$message({
              type: "info",
              message: spStr(res.msg, "PhotonPay", ""),
            });
          }
        })
        .catch((err) => {
          console.error(spStr(err, "PhotonPay", ""));
        });
    },
    getMume() {
      let res = {
        success: true,
        data: [
          {
            menuid: 111,
            icon: "el-icon-s-cooperation", 
            permission:true,
            menuname: "中心钱包",
            hasThird: null,
            url: null,
            permission:[],
            menus: [
              {
                menuid: 112,
                icon: "el-icon-goods",
                permission: this.$hasPermission(this.userInfo,['user0']),
                menuname: "我的钱包",
                hasThird: "N",
                url: "wallet",
                menus: null,
                isPermis: "",
                permission:[],
              },
              {
                menuid: 113,
                icon: "el-icon-sell",
                permission:true,
                menuname: "充值管理",
                hasThird: "N",
                url: "recharge",
                menus: null,
                isPermis: "01",
                permission:[],
              },
              // {
              //   menuid: 114,
              //   icon: "icon-cat-skuQuery",
              //   permission:true,
                // menuname: "提现管理",
              //   hasThird: "N",
              //   url: "withdrawal",
              //   menus: null,
              // },
              {
                menuid: 115,
                icon: "el-icon-sold-out",
                permission:true,
                menuname: "转账管理",
                hasThird: "N",
                url: "transfer",
                menus: null,
                isPermis: "01",
              },
            ],
          },
          {
            menuid: 121,
            icon: "el-icon-s-finance",
            permission:true,
            menuname: "Gwhale卡",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 122,
                icon: "el-icon-bank-card",
                permission:true,
               menuname: "Gwhale卡",
                hasThird: "N",
                url: "cards",
                menus: null,
                isPermis: "01",
              },
              {
                menuid: 126,
                icon: "el-icon-folder-opened",
                permission:true,
                menuname: "持卡人列表",
                hasThird: "N",
                url: "cardholder",
                menus: null,
                isPermis: "01",
              },
              {
                menuid: 128,
                icon: "el-icon-search",
                permission: this.$hasPermission(this.userInfo,['user7']),
                menuname: "3ds码查询",
                hasThird: "N",
                url: "searchCode",
                menus: null,
                isPermis: "01",
              },
              {
                menuid: 123,
                icon: "el-icon-set-up",
                permission: this.$hasPermission(this.userInfo,['user8','user9']),
                menuname: "交易明细",
                hasThird: "N",
                url: "Order",
                menus: null,
              },
              {
                menuid: 127,
                icon: "el-icon-cpu",
                permission: this.$hasPermission(this.userInfo,['user10','user11']),
                menuname: "手续费明细",
                hasThird: "N",
                url: "fee",
                menus: null,
              },
              {
                menuid: 124,
                icon: "el-icon-scissors",
                permission: this.$hasPermission(this.userInfo,['user12','user13']),
                menuname: "销卡列表",
                hasThird: "N",
                url: "sellingCards",
                menus: null,
              },
              {
                menuid: 125,
                icon: "el-icon-files",
                permission: this.$hasPermission(this.userInfo,['user14','user15']),
                menuname: "充值/退款记录",
                hasThird: "N",
                url: "payrecharge",
                menus: null,
              },
            ],
          },
          {
            menuid: 131,
            icon: "el-icon-s-custom",
            permission:true,
            menuname: "我的账户",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 132,
                icon: "el-icon-user", 
                menuname: "我的信息",
                hasThird: "N",
                url: "myInfo",
                menus: null, 
                permission: this.$hasPermission(this.userInfo,['user0']),
                // this.$hasPermission(['admin0'])
              },
              {
                menuid: 133,
                icon: "el-icon-office-building",
                permission:true,
                menuname: "企业认证",
                hasThird: "N",
                url: "companyAuth",
                menus: null, 
              },
              {
                menuid: 134,
                icon: "el-icon-monitor", 
                menuname: "Google认证",
                hasThird: "N",
                url: "gAuth",
                menus: null,
                permission: this.$hasPermission(this.userInfo,['user0']), 
              },
            ],
          },
          {
            menuid: 141,
            icon: "el-icon-s-comment",
            permission:true,
            menuname: "通知公告",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 142,
                icon: "el-icon-chat-dot-square",
                permission:true,
                menuname: "公告管理",
                hasThird: "N",
                url: "notice",
                menus: null,
              },
            ],
          },
          // {
          //   menuid: 151,
          //   icon: "el-icon-s-comment",
          //   permission:true,
            // menuname: "子账号管理",
          //   hasThird: null,
          //   url: null,
          //   menus: [
          //     {
          //       menuid: 152,
          //       icon: "el-icon-chat-dot-square",
          //       permission:true,
            // menuname: "子账号管理",
          //       hasThird: "N",
          //       url: "subAccount",
          //       menus: null,
          //     },
          //   ],
          // },
        ],
        msg: "success",
      };
      if (this.userInfo.userType == "00" || this.userInfo.userType=='03') { //管理员端
        res.data = [
          {
            menuid: 1,
            icon: "el-icon-s-cooperation",
            permission:true,
            menuname: "中心钱包",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 10,
                icon: "el-icon-pie-chart",
                permission:true,
                menuname: "会员统计",
                hasThird: "N",
                url: "walletAdmin",
                menus: null,
              },
              {
                menuid: 11,
                icon: "el-icon-sell",
                permission:true,
                menuname: "充值审核",
                hasThird: "N",
                url: "rechargeAdmin",
                menus: null,
                permission:this.$hasPermission(this.userInfo,['admin2']),
              },
              // {
              //   menuid: 12,
              //   icon: "icon-cat-skuQuery",
              //   permission:true,
            // menuname: "提现审核",
              //   hasThird: "N",
              //   url: "withdrawalAdmin",
              //   menus: null,
              // },
              {
                menuid: 13,
                icon: "el-icon-sold-out",
                permission:this.$hasPermission(this.userInfo,['admin3']),
                menuname: "转账审核",
                hasThird: "N",
                url: "transferAdmin",
                menus: null,
              },
            ],
          },
          {
            menuid: 2,
            icon: "el-icon-s-finance",
            permission:true,
            menuname: "NK卡管理",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 21,
                icon: "el-icon-bank-card",
                permission: this.$hasPermission(this.userInfo,['admin9']), 
                menuname: "NK卡管理",
                hasThird: "N",
                url: "cardsAdmin",
                menus: null,
              },
              // {
              //   menuid: 22,
              //   icon: "icon-order-manage",
              //   permission:true,
            // menuname: " ",
              //   hasThird: "N",
              //   url: "searchCode",
              //   menus: null,
              // },
              {
                menuid: 23,
                icon: "el-icon-set-up",
                permission:true,
                menuname: "交易记录",
                hasThird: "N",
                url: "OrderAdmin",
                menus: null,
              },
              {
                menuid: 24,
                icon: "el-icon-files",
                permission:true,
                menuname: "充值/退款记录",
                hasThird: "N",
                url: "payrechargeAdmin",
                menus: null,
              },
              {
                menuid: 25,
                icon: "el-icon-cpu",
                permission:true,
                menuname: "手续费记录",
                hasThird: "N",
                url: "feeAdmin",
                menus: null,
              },
            ],
          },
          {
            menuid: 3,
            icon: "el-icon-s-custom",
            permission:true,
            menuname: "会员管理",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 33,
                icon: "el-icon-user", 
                 menuname: "我的信息",
                hasThird: "N",
                url: "myInfo",
                menus: null,
                permission: this.$hasPermission(this.userInfo,['admin0']), 
              },
              {
                menuid: 31,
                icon: "el-icon-postcard",
                permission:true,
                menuname: "会员信息管理",
                hasThird: "N",
                url: "userList",
                menus: null,
              },
              {
                menuid: 32,
                icon: "el-icon-office-building",
                permission:this.$hasPermission(this.userInfo,['admin1']),
                menuname: "认证审核",
                hasThird: "N",
                url: "authRecordList",
                menus: null,
              },
              {
                menuid: 34,
                icon: "el-icon-odometer",
                permission:this.$hasPermission(this.userInfo,['admin4']),
                menuname: "费率配置",
                hasThird: "N",
                url: "feeList",
                menus: null,
              },
              {
                menuid: 35,
                icon: "el-icon-monitor",
                permission: this.$hasPermission(this.userInfo,['admin0']), 
                menuname: "Google认证",
                hasThird: "N",
                url: "gAuth",
                menus: null,
              },
              // {
              //   menuid: 33,
              //   icon: "icon-provider-manage",
              //   permission:true,
               // menuname: "信息管理",
              //   hasThird: "N",
              //   url: "userList",
              //   menus: null,
              // },
            ],
          },
          {
            menuid: 4,
            icon: "el-icon-s-comment",
            permission:true,
            menuname: "通知公告",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 41,
                icon: "el-icon-chat-dot-square",
                permission: this.$hasPermission(this.userInfo,['admin8']), 
                menuname: "公告管理",
                hasThird: "N",
                url: "noticeAdmin",
                menus: null,
                
              },
            ],
          },
         
        ];
      }

      if(this.userInfo.userType!='02'&&this.userInfo.userType!='03'){
        res.data.push(
          {
            menuid: 5,
            icon: "el-icon-s-comment",
            permission:true,
            menuname: "子账号管理",
            hasThird: null,
            url: null,
            menus: [
              {
                menuid: 51,
                icon: "el-icon-chat-dot-square",
                permission:true,
                menuname: "子账号管理",
                hasThird: "N",
                url: "subAccount",
                menus: null,
              },
            ],
          },
        )
       
      }
      this.allmenu = res.data;
      this.$root.Bus.$on("toggle", (value) => {
        this.collapsed = !value;
      });
    },
    handleSelect(key, keyPath) {
      if (key == this.$router.history.current.fullPath) {
        this.reload();
      }
    },
    toIndex() {
      this.$router.push({ path: "/" });
    },
  },
};
</script>
<style>
.el-menu-vertical-demo:not(.el-menu--collapse) {
  /* width: 340px; */
  padding: 0 20px;
  min-height: 400px;
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
  border: none;
  text-align: left;
}
.el-menu-item-group__title {
  padding: 0px;
}
.el-menu-bg {
  /* background-color: #1f2d3d !important; */
  /* background-color: #fff !important; */
}
.el-menu {
  border: none;
  background: transparent;
}
.el-submenu {
  font-weight: bold;
}
.el-submenu__title {
  margin: 5px 0;
  font-size: 18px!important; 
  padding: 0 10px!important; 
}
.el-submenu__title i,
.el-menu-item i {
  font-size: 18px;
  /* color: #a3aed0; */
  color: #e3b85a; 
}
.el-submenu__icon-arrow{
  right:10px!important;
}
.el-submenu .el-menu-item{
  padding-left: 20px!important;
}

.el-menu-item span { 
  /* color: #a3aed0; */
}

.el-submenu{
  font-weight: normal!important; 
}
.el-menu-item {
  margin: 5px 0;
  /* border-radius: 15px; */
  font-size: 16px; 
}

.el-submenu__title:hover,
.el-menu-item:focus,
.el-menu-item:hover,
.el-menu-item.is-active {
  /* border-radius: 15px; */
  color: #e3b85a;
  background-color: #e3b85a45 !important;
}
.el-menu-item.is-active span {
  color: #e3b85a;
}
.logobox {
  height: 90px;
  color: #9d9d9d;
  font-size: 20px;
  text-align: center;
  padding: 10px 0px;
}
.logoimg {
  /* height: 84px; */
  width: 100%;
}
</style>